<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="./css/discover.css">
    <title>发现</title>
</head>
<body>
    <!-- 头部 -->
    <header>
        <!-- 头部占位容器 -->
        <div class="hd-placeholder"></div>
        <div class="top">
            <div class="Back">
                <h1>Back</h1>
            </div>
            <div class="discover">
                <h2>发现</h2>
            </div>
            <div class="city">
                <select name="city" id="" size="1">
                    <option value="gz" selected>广州市</option>
                    <option value="sz">深圳市</option>
                    <option value="zs">中山市</option>
                    <option value="dg">东莞市</option>
                </select>
            </div>
        </div>
        <!-- 大家都在搜索的 -->
        <div class="bottom">
            <div class="search">
                <form action="">
                    <input type="text" placeholder="请输入商品名称">
                </form>
                <button>
                    <img src="./image/index/icon24.png" alt="">
                </button>
            </div>
            <div>
                <span>大家都在搜</span>
            </div>
            <ul>
                <li><a href="#">寿司</a></li>
                <li><a href="#">羽毛球</a></li>
                <li><a href="#">火锅</a></li>
                <li><a href="#">游泳馆</a></li>
                <li><a href="#">电影</a></li>
                <li><a href="#">周黑鸭</a></li>
                <li><a href="#">KTV</a></li>
                <li><a href="#">肯德基</a></li>
            </ul>
        </div>
    </header>
    <!-- 主体内容 -->
    <section>
        <!-- 热门搜索 -->
        <div class="hot">
            <!-- 更多 -->
            <div class="more">
                <div class="left">
                    <img src="./image/discover/形状-22.png" alt="">
                    <a href="#"><h2>热门搜索</h2></a>
                </div>
                <div class="right">
                    <a href="#">
                        <span>更多</span>
                        <img src="./image/index/更多.png" alt="">
                    </a>
                </div>
            </div>
            <!-- 商品图片列表 -->
            <div class="list">
                <div class="left"><a href="#"></a></div>
                <div class="right">
                    <div><a href="#"></a></div>
                    <div>
                        <div><a href="#"></a></div>
                        <div><a href="#"></a></div>
                    </div>
                </div>
            </div>
        </div>
        <!-- 推荐搜索 -->
        <div class="recommend">
            <!-- 更多 -->
            <div class="more">
                <div class="left">
                    <img src="./image/discover/形状-16.png" alt="">
                    <a href="#"><h2>推荐搜索</h2></a>
                </div>
                <div class="right">
                    <a href="#">
                        <span>更多</span>
                        <img src="./image/index/更多.png" alt="">
                    </a>
                </div>
            </div>
            <!-- 图片列表 -->
            <div class="list">
                <div></div>
                <div></div>
                <div></div>
            </div>
        </div>
    </section>
    <!-- 页脚导航栏 -->
    <footer>
        <div class="ft-placeholder"></div>
        <div class="nav">
            <a href="./index.html">
                <img src="./image/discover/首页1.png" alt="">
                <span>首页</span>
            </a>
            <a href="./classify.html">
                <img src="./image/index/分类4.png" alt="">
                <span>分类</span>
            </a>
            <a href="./discover.html">
                <img src="./image/discover/广场1.png" alt="">
                <span>发现</span>
            </a>
            <a href="./my.html">
                <img src="./image/index/我的.png" alt="">
                <span>我的</span>
            </a>
        </div>
    </footer>
</body>
</html>